<html>

<head>
	<meta charset="utf-8" />
	<title>个人主页</title>
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
	<link rel="stylesheet" type="text/css" href="css/style.css" />
	<link rel="stylesheet" href="css/bootstrap.min.css">
</head>

<body style="background-color: #333333; color:#fff;">
	<div class="container one">
		<div class="row">
			<div class="col-12">
				<header>
					<div class="logo">
					</div>
					<h1>个人主页</h1>
				</header>
			</div>
		</div>
		<div class="row">
			<div class="col-12">
				<div class="video">
					<video id="tm-welcome-video" class="tm-welcome-video" autoplay="" loop="" muted="">
						<source src="img/video.mp4" type="video/mp4">
					</video>
				</div>
			</div>
		</div>
	</div>


	<!-- 二 -->
	<div class="container two" style="max-width: 1170px;">
		<div class="row">
			<div class="col-lg-12 jz">
				<p class="tm-welcome-text ger">项目介绍</p>
			</div>
		</div>
		<div class="row   mian ">
			<div class="col-12">
				<div class=" tm-timeline-item">
					<div class="tm-timeline-item-inner">
						<img src="img/manwei.jpg" alt="Image" class="rounded-circle tm-img-timeline">
						<div class="tm-timeline-connector">
							<p class="mb-0">&nbsp;</p>
						</div>
						<div class="tm-timeline-description-wrap">
							<div class="tm-bg-dark tm-timeline-description" style="background-color: #262626;">
								<h3 class="tm-font-400" style="color: green;"><a href="http://y1214.gitee.io/bootstrap_4_making_manwei/">漫威网页</a></h3>
								<p>整个网站是使用bootstrap4制作而成。Bootstrap是包含了一个响应式的、移动设备优先的、不固定的网格系统， 可以随着设备或视口尺寸的大小的增加而适当地增加，使用更加的方便</p>
								<p class="tm-text-green float-right mb-0">制作时间 . 2019 04 03</p>
							</div>
						</div>
					</div>

					<div class="tm-timeline-connector-vertical"></div>
				</div>
				<div class="tm-timeline-item">
					<div class="tm-timeline-item-inner">
						<img src="img/ul.jpg" alt="Image" class="rounded-circle tm-img-timeline">
						<div class="tm-timeline-connector">
							<p class="mb-0">&nbsp;</p>
						</div>
						<div class="tm-timeline-description-wrap">
							<div class="tm-bg-dark-light tm-timeline-description" style="background-color: #404040;">
								<h3 class="tm-text-cyan tm-font-400"><a href="http://y1214.gitee.io/ui/">ul登录页</a></h3>
								<p>是使用的Flex布局制作而成,felx具有很多优点，不需要进行浏览器兼容测试、不再有布局界面的痛苦、简单的域验证、丰富的媒体支持、实现表现层和内容的真正分离。等多个优点从而使它受人们的喜爱.</p>
								<p class="tm-text-cyan float-right mb-0">制作时间 . 2019 04 16</p>
							</div>
						</div>
					</div>
					<div class="tm-timeline-connector-vertical"></div>
				</div>
				<div class="tm-timeline-item">
					<div class="tm-timeline-item-inner">
						<img src="img/jd.jpg" alt="Image" class="rounded-circle tm-img-timeline">
						<div class="tm-timeline-connector">
							<p class="mb-0">&nbsp;</p>
						</div>
						<div class="tm-timeline-description-wrap">
							<div class="tm-bg-dark tm-timeline-description">
								<h3 class="tm-text-yellow tm-font-400"><a href="http://y1214.gitee.io/shopping_cart_jd/">京东购物车</a></h3>
								<p>运用的JavaScript制作而成，JavaScript 是目前所有主流浏览器上唯一支持的脚本语言，这也是早期JavaScript的唯一用途。其主要作用是在不与服务器交互的情况下修改HTML页面内容。</p>
								<p class="tm-text-yellow float-right mb-0">制作时间 . 2019 09 13</p>
							</div>
						</div>
					</div>
					<div class="tm-timeline-connector-vertical"></div>
				</div>
				<div class="tm-timeline-item-inner">
					<img src="img/tianqi.jpg" alt="Image" class="rounded-circle tm-img-timeline">
					<div class="tm-timeline-connector">
						<p class="mb-0">&nbsp;</p>
					</div>
					<div class="tm-timeline-description-wrap">
						<div class="tm-bg-dark-light tm-timeline-description">
							<h3 class="tm-text-orange tm-font-400"><a href="http://y1214.gitee.io/tencent_weather/">腾讯天气</a></h3>
							<p>是使用天气 API 接口制作 API之主要目的是提供应用程序与开发人员以访问一组例程的能力，而又无需访问源码，或理解内部工作机制的细节。提供API所定义的功能的软件称作此API的实现。</p>
							<p class="tm-text-orange float-right mb-0">制作时间 . 2019 09 20</p>
						</div>
					</div>
				</div>
			</div>
		</div>
		<div class="row tm-section-mb tm-section-mt mt-5 mb-5">
			<div class="col-lg-4 col-md-4 col-sm-12 pr-lg-5 mb-md-0 mb-4">
				<h3 class="mt-2 mb-3 tm-text-gray">个人信息</h3>
				<p>
					姓名:要腾飞
					<br>
					性别:男
					<br>
					爱好:读书、听音乐
					<br>
					籍贯:河北省邯郸市
				</p>
			</div>
			<div class="col-lg-4 col-md-4 col-sm-12 pr-lg-5 mb-md-0 mb-4">
				<h3 class="mt-2 mb-3 tm-text-gray">联系方式</h3>
				<p>
					qq:647967336
					<br>
					手机号:15614301292(同微)
					<br>
					邮箱:647967336@qq.com
				</p>
			</div>
			<div class="col-lg-4 col-md-4 col-sm-12">
				<h3 class="mt-2 mb-3 tm-text-gray">掌握技能</h3>
				<p>
					H5C3
					<br>
					javascript
					<br>
					jQ
					<br>
					AJAX
					<br>
					vue
				</p>
			</div>
		</div>
		<div class="col-lg-6 mb-5">
			<h3 class="mb-4 tm-text-gray"><font style="vertical-align: inherit;"><font style="vertical-align: inherit;">请联系我</font></font></h3>
			<form action="#contact" method="post" class="tm-contact-form">
				<div class="row">
					<div class="form-group col-xl-6">
						<input type="text" id="contact_name" name="contact_name" class="form-control" placeholder="您的名字" required="">
					</div>
					<div class="form-group col-xl-6">
						<input type="email" id="contact_email" name="contact_email" class="form-control" placeholder="邮箱" required="">
					</div>
				</div>
				<div class="form-group">
					<textarea id="contact_message" name="contact_message" class="form-control" rows="6" placeholder="您想说的话" required=""></textarea>
				</div>
				<button type="submit" class="btn  tm-btn-send"><font style="vertical-align: inherit;"><font style="vertical-align: inherit;">发送</font></font></button>
			</form>
		</div>
		<footer class="row mt-5 mb-5">
            <div class="col-lg-12">
                <p class="text-center tm-text-gray tm-copyright-text mb-0">Copyright ©
                    <span class="tm-current-year">2019</span> Your Company Name 
                    
                    | Design: <a href="" class="tm-text-white">Timeless</a> More Templates <a href="http://www.cssmoban.com/"></a>
                </p>
            </div>
        </footer>
	</div>

	<script src="js/csript.js" type="text/javascript" charset="utf-8"></script>
</body>
</html>